﻿@{
    ViewBag.Title = "Apps";
}
<div class="panel-heading border-radius-10">
    <h2>Apps</h2>
</div>
<div class="panel-body">
    <div class="templatemo-content-widget no-padding">
        <div class="form-group text-right">
            <a href="/App/Add" class="templatemo-white-button">新建</a>
        </div>
        <div class="panel panel-default table-responsive">
            <table class="table table-striped table-bordered templatemo-user-table" id="app">
                <thead>
                    <tr>
                        <td>序号</td>
                        <td>应用名称</td>
                        <td>应用描述</td>
                        <td>详情</td>
                    </tr>
                </thead>
                <tbody>
                    <tr v-for="item in items">
                        <td>{{item.Num}}</td>
                        <td>{{item.Name}}</td>
                        <td>{{item.Description}}</td>
                        <td>
                            <a style="cursor:pointer;" v-on:click="Init(item.Id,item.Name)">初始化Zookeeper</a>
                            <a href="/App/Edit?id={{item.Id}}">编辑</a>
                            <a href="/Config/Index?appId={{item.Id}}">编辑环境</a>
                            <a style="cursor:pointer;" v-on:click="Delete(item.Id)">删除</a>
                        </td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
</div>
<script type="text/javascript">
    var vue = new Vue({
        el: '#app',
        data: {
            items: []
        },
        methods: {
            Init: function (id, name) {
                this.$http.get('/App/InitZookeeper?Id=' + id + "&AppName=" + name, function (data, status, request) {
                    if (data) {
                        alert("初始化成功");
                    } else {
                        alert("初始化失败");
                    }
                });
            },
            Delete: function (id) {
                this.$http.get('/App/Delete?Id=' + id, function (data, status, request) {
                    if (data.IsSuccess) {
                        alert("删除成功");
                        location.reload();  
                    } else {
                        alert(data.ErrorMsg);
                    }
                });
            }
        },
        ready: function () {
            var _self = this;
            _self.$http.get('/App/GetList', function (data, status, request) {
                $.each(data, function (i, item) {
                    item.Num = i + 1;
                    _self.items.push(item);
                });
            });
        }
    });
</script>